<script src="./donateareadetails.js"></script>
<style lang="scss" src='./donateareadetails.scss'></style>
<template>
      <div class="main">
        <div class="head">
          <i class="iconfont head-icon" @click="comeBack">&#xe689;</i>
            区域详情
        </div>

        <div class="project-head-img">
          <img :src="imageUrl.imageUrl+details.img">
        </div>

        <div class="project-content">
          <div class="pro-content">
            <p style="line-height: 12px"><em class="content-title" v-html="details.name"></em></p>
          </div>

          <div class="content-text">
            <div>
            {{details.remarks}}
            </div>
          </div>
        </div>

          <div class="con-list">
              <div class="company">
                <div class="otherProjects">
                  <!--该单位发起的其他项目-->
                  <div class="otherProjects-box">
                    <i class="iconfont head-icon" style="color: #e1a922;">&#xe637;</i><span>该区域项目</span>
                  </div>
                  <div class="otherProjects-content">
                    <div>
                      <flexbox v-for="eventOthers in donateList">
                        <flexbox-item :span="4">
                          <div class="item-image">
                            <img :src="imageUrl.imageUrl + eventOthers.eventPicUrl" alt="">
                          </div>
                        </flexbox-item>
                        <flexbox-item>
                          <div @click="goProjectDetails(eventOthers.eventId)">
                            <h3 class="item-title" v-html="eventOthers.eventName">梦想足球场 圆农村孩子的足球梦想地方否地方对方答复</h3>
                            <div class="progress" v-if="eventOthers.eventStatus == 1">
                              <span>{{eventOthers.schedule}}%</span>
                              <x-progress :percent="eventOthers.schedule" :show-cancel="false"></x-progress>
                            </div>
                            <div class="item-mujuan">
                              <span>已筹</span><em>{{eventOthers.raiseMoney}}</em><span>元</span>
                              <div style="float: right" v-if="eventOthers.eventStatus == 1">
                                <span>参加</span><em>{{eventOthers.attendPeople}}</em><span>人次</span></div>
                              <div class="item-jsbtn" v-if="eventOthers.eventStatus == 4">募捐结束</div>
                            </div>
                          </div>
                        </flexbox-item>
                      </flexbox>
                    </div>
                  </div>
                  <div class="more-btn-box" @click="lookMore">
                    <div class="more-btn" >查看更多</div>
                  </div>
                </div>
              </div>
          </div>

      </div>

</template>
